<template>
	<view>
		<u-navbar :is-back="isback" :title="title" :background="background" :border-bottom="false" :back-icon-color='backColor' :title-color='backColor' 
		title-size='32' back-icon-size='38' :titleBold='true'
		>
		   <slot class='navbar-left' name="left">
			  
			</slot>
		  <slot class='navbar-right' name="right">
			  
		   </slot>
		</u-navbar>
	</view>
</template>

<script>
	export default {
		name:"navbar",
		props: {
			backgroundColor:{
				type: String
			},
			title:{
				type:String,
				default:''
			},
			isback:{
				type:Boolean,
				default:true
			},
			backColor:{
				type: String,
				default:'#333333'
			}
		},
		data() {
			return {
				background: {
					 background: this.backgroundColor||'#fff'
					// 导航栏背景图
					// background: 'url(https://cdn.uviewui.com/uview/swiper/1.jpg) no-repeat',
					// 还可以设置背景图size属性
					// backgroundSize: 'cover',
					
					// 渐变色
					// backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				}
			};
		}
	}
</script>

<style lang="scss" scoped>
.u-border-bottom:after {
    border-bottom-width: 0px;
}
.navbar-right{
	position: absolute;
	right: 10px;
}
.navbar-left{
	position: absolute;
	left: 10px;
}
</style>